li{list-style: none}
.wrap{width:1100px;margin:0 auto; color:#666; line-height: 36px;  font-family:Gotham-Book,"microsoft yahei","Helvetica neue",Helvetica,Tahoma,"lantinghei sc";
font-size:18px;
}
*, *:before, *:after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-font-smoothing: antialiased;
}
.page{height:620px;padding:50px 50px 60px;position:relative;}
 h3{text-align:center;font-size:30px;color:#666}
 h3 em{color:rgb(240,72,76);font-style: normal;font-family:"Gotham-Bold","microsoft yahei","Helvetica neue",Helvetica,Tahoma,"lantinghei sc";}
.p1 .text{font-size:24px;}
.p1 .text em{font-style: normal;font-weight:bold;}
.cBox{display:table;margin:100px auto;}
.cBox li{width:10%;text-align: center;height:120px;vertical-align: middle;display: table-cell;
/*-webkit-animation:scaleShow 0.8s ease-in-out backwards;
-moz-animation:scaleShow 0.8s ease-in-out backwards;
-ms-animation:scaleShow 0.8s ease-in-out backwards;
-o-animation:scaleShow 0.8s ease-in-out backwards;
animation:scaleShow 0.8s ease-in-out backwards*/

}

.sBox{width:80%!important;}
.cBox li img{vertical-align: middle;display:inline-block;}

.p2 .cBox{width:100%;position:relative}
.p2 .cBox li{width:33%;}
.p2 .cBox li img{max-width:100%;max-height: 290px}
.p2 .txt-img{position:absolute;left:50%;top:50%;margin-left:-310px;margin-top:-30px}
.p2 .txt-img img{max-width: 90%}

dl,dt,dd{    font-family: Gotham-Book,"microsoft yahei","Helvetica neue",Helvetica,Tahoma,"lantinghei sc";}
.c-red{color:rgb(212,53,34)}
.c-green{color:rgb(113,174,70)}
.p3{height:900px;}
.p3 .cBox{width:100%;position:relative}
.p3 .cBox li{width:33%;}
.p3 .cBox li img{max-width:100%;max-height: 360px}
.p3 .tBox{display:table;}
.p3 .tBox li{width:50%;display: table-cell;padding:0 20px}
.tBox dl{padding-bottom: 40px}
.tBox dt{font-size:20px;text-align: center;line-height: 25px;}
.tBox dd{font-size:16px;padding-left:100px;line-height: 22px;padding-top:10px;}

.p4{position:relative}
.p4 img{max-width:100%}
.p4 div{position:absolute;}
.p4 .c1{width:600px;top:150px;left:50%;margin-left:-300px;}
.p4 .c2{width:300px;top:336px;left:50%;margin-left:-138px;}
.p4 .c3{width:250px;top:140px;left:50%;margin-left:-280px; padding-top:200px;}
.p4 .c4{width:250px;top:140px;left:50%;margin-left:110px;padding-top:200px;}
.p4 .c5{width:190px;top:368px;left:50%;margin-left:-250px;
background:#fff;color:rgb(224,33,37);border-radius:50%;
    text-align:center;height:190px;line-height:25px;vertical-align: middle;padding:70px 0;
}
.p4 .c6{width:190px;top:368px;left:50%;margin-left:140px;
    background:#fff;color:rgb(224,33,37);border-radius:50%;
    text-align:center;height:190px;line-height:25px;padding:70px 0;
}

.p4 .c7{position:absolute;}
.p4 .c8{right:80px;top:230px;}
.p4 .c9{right:-150px;top:460px;}
.p4 .c10{left:40px;top:460px;}

.p4 .c7 i{display:inline-block;border-bottom: 2px solid rgb(224,33,37);width:50px;position:relative;margin-right:25px;float:left;margin-top:20px;}
.p4 .c7 i:before{content: "";width:10px;height:10px;background: rgb(224,33,37);border-radius:50%;position:absolute;top:50%;
margin-top:-5px;left:100%;
}
.p4 .c7.left i{width:80px;margin-left:-30px;}
.p4 .c7.left i:before{content: "";width:10px;height:10px;background: rgb(224,33,37);border-radius:50%;position:absolute;top:50%;
    margin-top:-5px;right:100%;left:0;
}
.p4 .c7 em{display:inline-block;font-style:normal;
background:rgb(224,33,37);color:#fff;width:26px;height:26px;
    border-radius:50%;font-size:14px;line-height:26px;
    text-align:center;float:left;margin-top:6px;
}

.p4 .c7 span{float:left;padding:0 10px;}
.p4 .c7 h3{font-size:22px;color:rgb(224,33,37);line-height: 14px;margin-top:10px;text-align:left;}
.p4 .c7 p{font-size:14px;color:#999;text-align:left;}

.p5{}
.p5 .oBox{position:relative;margin-top:50px;}
.p5 .oBox li{position:absolute}
.p5 .oBox li > div{position:relative;top:0;left:0;width:100%}
.p5 .oBox li > div> img{max-width:100%}
.p5 .oBox li > span{display: block;text-shadow: 0.5px 0.5px 10px #aaa;
    font-size:14px;line-height:20px;width:100%;color:#fff;
    position:absolute;left:0;top:50%;text-align:center;margin-top:-30px;


}

.p5 .oBox li.n1{left:40px;top:50px;width:180px;}
.p5 .oBox li.n2{left:174px;top:170px;width:160px;}
.p5 .oBox li.n3{left:300px;top:60px;width:180px;}
.p5 .oBox li.n4{left:390px;top:210px;width:180px;}
.p5 .oBox li.n5{left:510px;top:80px;width:180px;}
.p5 .oBox li.n6{left:676px;top:26px;width:160px;}
.p5 .oBox li.n7{left:730px;top:160px;width:240px;}

.rotateRight{
    -webkit-animation:changeRight 5s linear infinite;
}

@-webkit-keyframes changeRight {
    0%{-webkit-transform:rotate(0deg);}
    100%{-webkit-transform:rotate(360deg);}
}

.rotateLeft{
    -webkit-animation:changeLeft 5s linear infinite;
}

@-webkit-keyframes changeLeft {
    0%{-webkit-transform:rotate(0deg);}
    100%{-webkit-transform:rotate(-360deg);}
}


.anmation{
    -webkit-transition: all 0.8s 2.1s ease  ;
    -moz-transition: all 0.8s 2.1s ease  ;
    -ms-transition: all 0.8s 2.1s ease  ;
    -o-transition: all 0.8s 2.1s ease  ;
    transition: all 0.8s 2.1s ease  ;
}
@keyframes scaleShow{
    0%{
        opacity:0;
        transform: scale(0);
    }
    80%{
        transform: scale(1.2);
    }
    100%{
        opacity:1;
        transform: scale(1);
    }
}
@-webkit-keyframes scaleShow{
    0%{
        opacity:0;
        -webkit-transform: scale(0);
    }
    80%{
        -webkit-transform: scale(1.2);
    }
    100%{
        opacity:1;
        -webkit-transform: scale(1);
    }
}
@-moz-keyframes scaleShow{
    0%{
        opacity:0;
        -moz-transform: scale(0);
    }
    80%{
        -moz-transform: scale(1.2);
    }
    100%{
        opacity:1;
        -moz-transform: scale(1);
    }
}
@-ms-keyframes scaleShow{
    0%{
        opacity:0;
        -ms-transform: scale(0);
    }
    80%{
        -ms-transform: scale(1.2);
    }
    100%{
        opacity:1;
        -ms-transform: scale(1);
    }
}
@-o-keyframes scaleShow{
    0%{
        opacity:0;
        -o-transform: scale(0);
    }
    80%{
        -o-transform: scale(1.2);
    }
    100%{
        opacity:1;
        -o-transform: scale(1);
    }
}




@-webkit-keyframes rotateInLeft {
    0% {
        opacity: 0;
        -webkit-transform: translateX(-800px) rotate(-200deg);
        transform: translateX(-800px) rotate(-200deg);
    }

    100% {
        -webkit-transform: translateX(0px)  rotate(0deg);
        transform: translateX(0px)  rotate(0deg);

    }
}

@keyframes rotateInLeft {
    0% {
        opacity: 0;
        -webkit-transform: translateX(-800px) rotate(-200deg) ;
        -ms-transform: translateX(-800px) rotate(-200deg);
        transform: translateX(-800px) rotate(-200deg);

    }

    100% {
        -webkit-transform: translateX(0px)  rotate(0deg);
        -ms-transform: translateX(0px)  rotate(0deg);
        transform: translateX(0px)  rotate(0deg);

    }
}

.rotateInLeft {
    -webkit-animation-name: rotateInLeft;
    animation-name: rotateInLeft;
    animation-duration:2s;
    -webkit-animation-duration:2s;
}




@-webkit-keyframes rotateInRight {
    0% {
        opacity: 0;
        -webkit-transform: translateX(500px) rotate(200deg);
        transform: translateX(500px) rotate(200deg);
    }

    100% {
        -webkit-transform: translateX(0px)  rotate(0deg);
        transform: translateX(0px)  rotate(0deg);

    }
}

@keyframes rotateInRight {
    0% {
        opacity: 0;
        -webkit-transform: translateX(500px) rotate(200deg) ;
        -ms-transform: translateX(500px) rotate(200deg);
        transform: translateX(500px) rotate(200deg);

    }

    100% {
        -webkit-transform: translateX(0px)  rotate(0deg);
        -ms-transform: translateX(0px)  rotate(0deg);
        transform: translateX(0px)  rotate(0deg);

    }
}

.rotateInRight {
    -webkit-animation-name: rotateInRight;
    animation-name: rotateInRight;
    animation-duration:2s;
    -webkit-animation-duration:2s;
}



@-webkit-keyframes Inleft {
    0% {
        opacity: 0;
        -webkit-transform: translateX(-800px) ;
        transform: translateX(-800px);
    }

    100% {
        -webkit-transform: translateX(0px);
        transform: translateX(0px);

    }
}

@keyframes Inleft {
    0% {
        opacity: 0;
        -webkit-transform: translateX(-800px) ;
        -ms-transform: translateX(-800px);
        transform: translateX(-800px);

    }

    100% {
        -webkit-transform: translateX(0px);
        -ms-transform: translateX(0px);
        transform: translateX(0px);

    }
}

.Inleft {
    -webkit-animation-name: Inleft;
    animation-name: Inleft;
    animation-duration:2s;
    -webkit-animation-duration:2s;
}